<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" name="viewport">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>一朵 - 收货地址</title>
  <!-- swiper-2.7css -->
    <link rel="stylesheet" href="__STATIC__/index/js/swiper/idangerous.swiper.css">
  <!-- swiper-2.7js -->
    <script src="__STATIC__/index/js/swiper/idangerous.swiper.min.js"></script>
  <!-- jquery-3.2.1引用 -->
    <script src="__STATIC__/index/js/global/jquery-3.2.1.min.js"></script>
  <!-- 阿里巴巴矢量图库 -->
    <link rel="stylesheet" href="http://at.alicdn.com/t/font_561814_t3316kgx96kcsor.css">
  <!-- 公共头部 脚部 -->
    <link rel="stylesheet" href="__STATIC__/index/css/global/global.css">
  <!-- 超过960屏幕 -->
    <link rel="stylesheet" media="screen and (min-width: 960px)" href="__STATIC__/index/css/address_fill/address_fill960.css" />
  <!-- 768-959 -->
    <link rel="stylesheet" media="screen  and (min-width: 768px) and (max-width: 959px) " href="__STATIC__/index/css/address_fill/address_fill768.css"
    />
  <!-- 568-767 -->
    <link rel="stylesheet" media="screen  and (min-width: 568px) and (max-width: 767px) " href="__STATIC__/index/css/address_fill/address_fill568.css"
    />
  <!-- 375-567 -->
    <link rel="stylesheet" media="screen  and (min-width: 375px) and (max-width: 567px) " href="__STATIC__/index/css/address_fill/address_fill375.css"
    />
  <!-- 小于375-->
    <link rel="stylesheet" media="screen  and (max-width: 374px) " href="__STATIC__/index/css/address_fill/address_fill320.css" />
  <!--一引入layer-->
    <script src="__STATIC__/layer/layer.js"></script>
</head>
<body>
    <div class="M">
        <div class="m-header">
            <div>
                <span onclick="go_back();">
                    <span class="iconfont icon-xiangzuo" ></span>
                    返回
                </span>
                <span>收货地址</span>
                <span>
                    {if condition="!empty($realname)"}
                        <a href="{:url('User/index')}" class="my" >
                            {$realname}
                        </a>
                    {else /}
                        <a href="{:url('Login/loginin')}">登录</a>
                        <a href="{:url('Login/register')}">注册</a>
                    {/if}
                    <a href="{:url('MyCart/my_cart')}" class="car">
                        <span class="iconfont icon-gouwuche"></span>
                        <span>{$cart_num}</span>
                    </a>
                </span>
            </div>
        </div>
        <div class="m-address-xin-content">
            <!-- 名字填写 -->
            <div class="m-address-name">
                <div>
                    <label for="m-address-name">姓名</label>
                    <input type="text" id="m-address-name" placeholder="请填写收货人姓名" name="consignee" value="{$info.consignee}">
                </div>
            </div>
            <!-- 联系方式填写 -->
            <div class="m-address-phone">
                <div>
                    <label for="m-address-phone">手机号</label>
                    <input type="text" id="m-address-phone" onkeyup="value=value.replace(/[^\d]/g,'')" placeholder="请填写手机号" name="mobile" value="{$info.mobile}">
                </div>
            </div>
            <!-- 城市选择 -->
            <div class="m-address-address">
                <div>
                    <label for="m-address-phone">地址选择</label>
                    <select name="city" id="city">
                        {foreach name="city" item="v"}
                        <option value="{$v.value}" {if condition="$info.city eq $v.value"}>{$v.value}</option>
                        {/foreach}
                    </select>
                </div>
            </div>
            <!-- 名字填写 -->
            <div class="m-address-detailAddress">
                <div>
                    <label for="m-address-name">详细地址</label>
                    <input type="text" id="m-address-name" placeholder="请输入详细地址" name="address" value="{$info.address}">
                </div>
            </div>
            <div class="m-address-tacitly">
                <div>
                    <label for="m-tacitly">
                        <span>
                            <img id="m-tacitly-img" src="__STATIC__/index/img/order/tacitly.png" alt="">
                        </span>
                        <input type="checkbox" id="m-tacitly"  name="is_default" value="1">
                        <span>设置为默认地址</span>
                    </label>
                </div>
            </div>
            <input type="hidden" name="id" value="{$info.id}">
            <a href="javascript:;" onclick="check_form()">
                保存地址
            </a>
        </div>
    </div>
    <div class="PC">
        <img src="__STATIC__/index/img/global/phone.png" alt="">
        <p>该页面只支持移动端的提示页面</p>
        <a href="{:url('User/index')}">返回</a>
    </div>
    <script>
        /**
         * 返回上一页
         */
        function go_back(){
            window.history.back();  //返回上一页
        }
        $(function () {
            // 移动端默认地址选择
            $('#m-tacitly').change(function () {
                if ($(this).is(':checked')) {
                    console.log('1====>', $(this).is(':checked'))
                    $('#m-tacitly-img').css('display', 'inline-block');
                    $('#m-tacitly').addClass('ischecked');
                } else {
                    $('#m-tacitly-img').css('display', 'none');
                    $('#m-tacitly').removeClass('ischecked');
                    console.log(2);
                }
            });
        });

        function check_form(){
            var consignee = $('input[name=consignee]').val();
            var mobile = $('input[name=mobile]').val();
            var city = $('#city option:selected').val();
            var address = $('input[name=address]').val();
            var reg = /^1([358][0-9]|4[579]|66|7[0135678]|9[89])[0-9]{8}$/;
            var id = $('input[name=id]').val();

            if($('input[name=is_default]').hasClass('ischecked')){
                var is_default = 1;
            }else{
                var is_default = 0;
            }

            if(consignee == ''){
                layer.msg('请输入收货人',{icon:2,time:1500,shade: 0.1}, function(index){
                    layer.close(index);
                    location.reload();
                });
                return false;
            }

            if(mobile == ''){
                layer.msg('请输入联系电话',{icon:2,time:1500,shade: 0.1}, function(index){
                    layer.close(index);
                    location.reload();
                });
                return false;
            }

            if (!reg.test(mobile)) {
                layer.msg('请输入正确的手机号',{icon:2,time:1500,shade: 0.1}, function(index){
                    layer.close(index);
                });
                return false;
            }

            if(city == ''){
                layer.msg('请选择所在城市',{icon:2,time:1500,shade: 0.1}, function(index){
                    layer.close(index);
                });
                return false;
            }

            if(address == ''){
                layer.msg('请输入收货地址',{icon:2,time:1500,shade: 0.1}, function(index){
                    layer.close(index);
                });
                return false;
            }

            $.post("{:url('Address/m_add_edit')}",
                {consignee:consignee,mobile:mobile,city:city,address:address,is_default:is_default,id:id},
                function(data){
                    if(data.code == 1){
                        layer.msg('保存成功',{icon:1,time:1500,shade: 0.1}, function(index){
                            layer.close(index);
                            window.location.href = "{:url('Address/index')}";
                        });
                        return false;
                    }else{
                        layer.msg(data,msg,{icon:2,time:1500,shade: 0.1}, function(index){
                            layer.close(index);
                        });
                        return false;
                    }
                }

            );

        }
    </script>
</body>
</html>